<%@page import="com.yunhuakeji.wddx.utils.IsNull"%>
<%@page import="net.sf.json.JSONObject"%>
<%@page import="net.sf.json.JSONArray"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
JSONObject result ;
JSONArray data = null;
String tgl = "";
String ranking = "";
String jl1 = "";
String jl2 = "";
try{
	result = JSONObject.fromObject(request.getAttribute("result")); 
	if(IsNull.isNotNull(result.toString())){
		tgl = result.getString("pm");
		//ranking = result.getString("ranking");
		jl1 = result.getJSONArray("describe").getString(0);
		jl2 =  result.getJSONArray("describe").getString(1);
		if(IsNull.isNotNull(result.getJSONObject("pie_data").toString())){
		data = result.getJSONObject("pie_data").getJSONArray("series_data");
	}
	}
	System.out.println(result);
} catch (Exception e) {
	result = null;
	}
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>成绩报告</title>
     <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" type="text/css" href="css/myreport.css">
	<link rel="stylesheet" type="text/css" href="css/selectStyle.css">
	<script src="js/jquery.min.js"></script>
	<script src="js/selectCustom.js"></script>
	<script src="js/highcharts.js"></script>
	<script src="js/myReport.js"></script>
	<script src="js/layer.js"></script>
  </head>
  
  <body>
  <%if(IsNull.isNotNull(result.toString())){ %>
    	<div class="report-header">
    		<div class="report-header-container">
    			<div class="report-col-1 pl5 pr5">< </div>
    			<div class="report-col-8 pl5 pr5">
    					<select class="custom" onchange="getScores(this);">
	    				</select>
    			</div>
    			<div class="report-col-1 pl5 pr5"></div>
    		</div>
    		<div class="clear"></div>
    	</div>
    	<div class="report-menu">
    		<div class="border-bot-dotted">
    			<div>本学期课程通过率<span class="color-red" id="tgl"><%-- <%=result.getString("pm") %> --%></span></div>
    			<div class="mt20 text-center">
    				<div class="mt20"><a>课程通过率分析</a></div>
    				<div class="mt20" id="tglPic">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    				</div >
    				<div class="mt20"><a>课程通过率高于全校的<span class="color-red" id="ph"><%-- <%=result.getString("ranking") %> --%></span>的同学</a></div>
    				<div class="mt20 text-left gray">结论 : <span id="jl1"><%-- <%=result.getJSONArray("describe").getString(0) %> --%> </span></div>
    			</div>
    		</div>
    		<div>
    			<div class="mt10 text-center">
    				<div><a>成绩分布情况分析</a></div>
    				<div id="cjchart"></div>
    				<div class="text-left gray">结论 : <span id="jl2"><%-- <%=result.getJSONArray("describe").getString(1) %> --%></span></div>
    			</div>
    		</div>
    	</div>
   
  <script>
  	var user_id = '<%=request.getParameter("userid")%>';
	var user_name = '<%=session.getAttribute("username")%>';
	var faceaddress = '<%=session.getAttribute("faceaddress")%>';
	var ticket = '<%=request.getParameter("ticket")%>';

//获取学期下拉列表
$.ajax({
		url:'reportapp/getCJForPcDefault.action?userid='+user_id+'&ticket='+ticket,
		type:'get',
		dataType:'json',
		success:function(data){
			$.each(data.content.message.items,function(i,r){
				var html = '<option value='+r["rm_xq"]+'>'+r["xnxq"]+'</option>';
				$('.custom').append(html);
			});
			//修改下拉选框的样式
	 		$(".custom").selectCustom({'divclasses':'position-absolute-center'});
		}
	});
//创建myreport对象
var report = new myReport();
//获取饼图数据
var datas = {format:'',data:'',pointFormat:''};
	var data = <%=data%>;
	datas.data = data;
	datas.format = "<b>{point.name}</b>: {point.y}科";
	datas.pointFormat = "总数:<b>{point.y}科 <br>{series.name} <b>{point.percentage:.1f}%<br>";
	datas.domId = "cjchart";
//页面数据
var pageDate = {tgl:'',ph:'',jl1:'',jl2:''}
	pageDate.tgl = '<%=tgl%>';
	pageDate.ph = '<%=ranking%>';
	pageDate.jl1 = '<%=jl1%>';
	pageDate.jl2 = '<%=jl2%>';
	 //控制课程通过率百分比
var imgs = $("#tglPic img");
	 loadPage(pageDate,datas);
	 
 //ajax加载数据切换页面
function loadPage(pageDate,datas){
	 	//绑定文字
	 	for(i in pageDate){
	 		$("#"+i).text(pageDate[i]);
	 	}
	 	//绑定通过率图片
	 	report.setTglPic(imgs,pageDate.ph);
	 	//绑定饼图
	 	report.createChart(datas);
	 }
//按年份切换数据
function getScores(a){
	 	$.ajax({
	 		url:'reportapp/getScoresJson.action?userid='+user_id+'&rm_xq='+$(a).val()+'&ticket='+ticket,
	 		type:'get',
	 		dataType:'json',
	 		beforeSend:function(){
	 			layer.open({
				  type:2,
				  content:'加载中',
				  shade: 'background-color: rgba(0,0,0,0.2)'
				});
		 	},
	 		success:function(data){
	 			layer.closeAll();
	 			datas.data = data["pie_data"]["series_data"];
	 			pageDate.tgl = data["pm"];
				pageDate.ph = data["ranking"];
				pageDate.jl1 = data["describe"][0];
				pageDate.jl2 = data["describe"][1];
				loadPage(pageDate,datas);
	 		},
	 		error:function(){
	 			layer.closeAll();
	 			 layer.open({
				    content: '网络异常'
				    ,skin: 'msg'
				    ,time: 2 //2秒后自动关闭
				  });
	 		}
	 	});
	 }

  </script>
   <%}else{ %>
       <div class="noData">
            <img alt="" src="img/noData.png">
            <div class="mt20">暂无数据</div>
       </div>
   <%} %>
  </body>
</html>
